<template>
	<view class="casting">
		<view class="casting_title">
			功能区
		</view>
		<view class="casting_suipian">
			<view class="suipian_one" v-for="(item,index) in detailInfo.award" :key="index">
				<image :src="item.image" mode="aspectFill"></image>
				<view class="suipian_one_title">
					{{item.name}}碎片（{{item.num||0}}）
				</view>
			</view>
		</view>
		<!-- 铸造按钮 -->
		<view class="casting_zhuzao_button" @click="goZhuzao">
			铸造
		</view>
		<!-- 合成样式 -->
		<view class="casting_hecheng" v-if="detailInfo">
			<image :src="detailInfo.adl.image" mode="aspectFill"></image>
			<view class="casting_hecheng_title">
				{{detailInfo.adl.name}}（{{detailInfo.adl.kdj}}）
			</view>
		</view>
		<view class="casting_zhuzao_button" @click="goHechenglianjie">
			合成上链
		</view>
		<view class="casting_title">
			我的兑换码
		</view>
		<!-- 兑换商品内容 -->
		<view class="casting_goods" v-for="(items,indexs) in shanglianArray" :key="indexs">
			<view class="casting_goods_left">
				<view class="left_title">
					合成时间：{{items.createtime}}
				</view>
				<view class="left_name">
					{{items.name||''}}(已合成)
				</view>
			</view>
			<view class="casting_goods_right" :class="{right_hui_button:items.is_fz!=0}" @click="copy(items)">
				复制兑换码
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data(){
			return {
				detailInfo:"",
				page:1,
				last_page:1,
				shanglianArray:[]
			}
		},
		onLoad() {
			this.getzhuzao()//铸造列表
			this.getHecheng('init')//铸造列表
		},
		onReachBottom() {
			if(this.page<this.last_page){
				this.page++
				this.getHecheng()//铸造列表
			}
		},
		methods:{
			async getzhuzao(){
				await uni.request({
					url:"/wanlshop/Signin/duanzao_list",
					method:"POST",
					data:{},
					success: (res) => {
						console.log(res.data,'铸造列表')
						this.detailInfo=res.data
					}
				})
			},
			async getHecheng(type){
				await uni.request({
					url:"/wanlshop/Signin/adl_cp_user_list",
					method:"POST",
					data:{},
					success: (res) => {
						this.last_page=res.data.last_page
						if(res.data.data.length){
							if(this.page==1){
								this.shanglianArray=res.data.data
							}else{
								this.shanglianArray=[...this.shanglianArray,...res.data.data]
							}
						}
						console.log(res.data,'铸造列表123')
					}
				})
			},
			async goZhuzao(){
				await uni.request({
					url:"/wanlshop/Signin/duanzao_order",
					method:"POST",
					data:{},
					success: (res) => {
						this.$wanlshop.msg(`铸造成功，获得${res.data.name}碎片一个`)
						this.getzhuzao()//铸造列表
					}
				})
			},
			async goHechenglianjie(){
				await uni.request({
					url:"/wanlshop/Signin/adl_order",
					method:"POST",
					data:{
						id:this.detailInfo.adl.id
					},
					success: (res) => {
						this.$wanlshop.msg('合成上链成功')
						this.getHecheng('init')//铸造列表
					}
				})
			},
			async copy(value) {
				this.$set(value,'is_fz',1)
				await uni.request({
					url:"/wanlshop/Signin/adl_cp_user_fz",
					method:"POST",
					data:{
						id:value.id
					},
					success: () => {
						uni.setClipboardData({
							data: value.order_no, //要被复制的内容
							success: () => { //复制成功的回调函数
								uni.showToast({ //提示
									title: '复制成功',
									icon: "none"
								})
							}
						});
					}
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.casting{
		width: 100%;
		box-sizing: border-box;
		padding: 20rpx 24rpx;
		.casting_title{
			width: 100%;
			text-align: center;
			font-size: 30rpx;
			color: #333333;
			font-weight: 800;
		}
		.casting_suipian{
			width: 100%;
			display: flex;
			justify-content: space-between;
			margin-top: 25rpx;
			.suipian_one{
				image{
					width: 200rpx;
					height: 240rpx;
					border-radius: 10rpx;
				}
				.suipian_one_title{
					font-size: 28rpx;
					color: #333333;
					margin-top: 15rpx;
				}
			}
		}
		.casting_zhuzao_button{
			width: 50%;
			height: 80rpx;
			line-height: 80rpx;
			text-align: center;
			background-color: #ff3d33;
			border-radius: 15rpx;
			font-size: 30rpx;
			color: #ffffff;
			margin: 60rpx auto 40rpx;
		}
		.casting_hecheng{
			width: 300rpx;
			margin: 0 auto;
			text-align: center;
			image{
				width: 300rpx;
				height: 320rpx;
				border-radius: 15rpx;
			}
			.casting_hecheng_title{
				font-size: 28rpx;
				color: #333333;
				margin-top: 15rpx;
			}
		}
		.casting_goods{
			width: 100%;
			margin-top: 25rpx;
			box-sizing: border-box;
			padding: 30rpx 0;
			border-top: 1rpx solid #cccccc;
			border-bottom: 1rpx solid #cccccc;
			display: flex;
			align-items: center;
			justify-content: space-between;
			.casting_goods_left{
				.left_title{
					font-size: 28rpx;
					color: #333333;
				}
				.left_name{
					font-size: 32rpx;
					color: #333333;
					margin-top: 10rpx;
				}
			}
			.casting_goods_right{
				width: 30%;
				height: 80rpx;
				line-height: 80rpx;
				text-align: center;
				background-color: #ff3d33;
				border-radius: 40rpx;
				font-size: 28rpx;
				color: #ffffff;
			}
			.right_hui_button{
				background-color: #cccccc;
			}
		}
	}
</style>